<%--
  Created by IntelliJ IDEA.
  User: 荔向荣
  Date: 2022/5/20
  Time: 20:12
  To change this template use File | Settings | File Templates.
--%>

<%@ page contentType="text/html;charset=UTF-8" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.1/css/bootstrap.min.css">
    <title>查询读者</title>
</head>
<body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.1/js/bootstrap.min.js"></script>

<%--查询到的读者记录展示--%>
<table class="table table-hover " id="book_table">
    <thead class="thead-light">
    <tr>
        <th>选中</th>
        <th>编号ID</th>
        <th>书号</th>
        <th>书名</th>
        <th>作者</th>
        <th>出版社</th>
        <th>价格</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <c:if test="${not empty sessionScope.book}">
        <c:forEach items="${sessionScope.book}" var="Book">
            <tr>
                <td id="delete">
                        <%--平行--%>
                    <label style="margin-bottom:0rem">
                        <input type="checkbox" style="width:50px;height:20px" id="checked" name="checked" value="${Book.bkID}">
                    </label>
                </td>
                <td style="vertical-align: middle"><strong>${Book.bkID}</strong></td>
                <td style="vertical-align: middle"><strong>${Book.bkCode}</strong></td>
                <td style="vertical-align: middle;color: dodgerblue"><strong>${Book.bkName}</strong></td>
                    <%--                <td style="color: darkorange;vertical-align: middle">${Book.bkName}</td>--%>
                <td style="vertical-align: middle"><strong>${Book.bkAuthor}</strong></td>
                <td style="vertical-align: middle"><strong>${Book.bkPress}</strong></td>
                <td style="vertical-align: middle"><strong>${Book.bkPrice}</strong></td>
                <td style="vertical-align: middle;color:dodgerblue"><strong>${Book.bkStatus}</strong></td>
                <td>
                    <button id="single_delete" type="button" class=" btn btn-outline-danger">删除选中</button>
                </td>
            </tr>
        </c:forEach>
    </c:if>
    </tbody>
</table>

</body>
<script>
    $(document).click(function (e) {
        if ($(e.target).attr('id') === 'single_delete') {
            let option = $("#delete input:checked");
            var str = "";
            console.log(option.length);
            if (option.length === 0) {
                alert("请先勾选再进行操作!")
                return false;
            }
            if (option.length > 1) {
                alert("只能选中一项删除!");
                return false;
            }
            if ($(e.target).parents('tr').children('td').eq(7).text() === '不在馆') {
                alert("已被借出，不可删除");
                return false;
            }
            if (confirm("确认删除吗?")) {
                str = "checked=" + option.val();
                console.log(str)
                $.post("http://localhost:8080/deleteBookServlet", str, function (data, status) {
                    alert("删除成功");
                    console.log(data);
                    console.log(status);
                    $("#test1").load("deleteBook.jsp");
                }, 'html')
                return false;
            }
        }
    })
</script>
</html>
